<template>
  <div class="pages verify">
    <div class="pageLevel" >
      <!-- 头部 -->
      <div class="content">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
          <el-form-item>
            <el-button type="primary" @click="goBack()"> 返回</el-button>
            <el-button type="primary" @click="submitForm('ruleForm')" style="margin-left:50px;">提交</el-button>
            <el-button type="primary" @click="routerPush('finance-boundCard','1','11')" style="margin-left:50px;">修改绑卡信息</el-button>
          </el-form-item>
          <div class="box1"> 中金支付向您{{message.bankCardNumber}}的银行账户中打入一笔资金，请查询后输入正确的打款金额</div>
          <el-form-item label="打款金额" prop="name">
            <input class="commonInput" v-model="value" :disabled="disableds" @blur="blur(value)" size="mini" type="text">
            <!-- <el-input v-model="ruleForm.name" maxlength="8" style="width:30%;"></el-input> -->
            <span style="color:#606266;font-size:14px;margin-left:10px;">元</span>
            <div class="span2">打款金额为0.01-1元之间</div>
          </el-form-item>
          <el-form-item label="">
            <div style="color:#606266;font-size:14px;">注意: 请在{{message.timeOut}}之前完成填写，否则需要重新绑卡</div>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";
import util from "@/util";
import { activateBankCard, getAccountInfo } from "@/api";
export default {
  computed: mapState([
    "merchantId",
  ]),
  data() {
    return {
      message: {},
      value: this.val,
      ruleForm: {
        name: "111"
      },
      rules: {
        name: [{ required: true, message: "请输入打款金额", trigger: "blur" }]
      }
    };
  },
  watch: {
    val: function(val) {
      this.value = val;
    },
    value: function(val) {
      val = val.toString();
      let arr = val.split(".");
      let num = "";
      arr[0] = arr[0].replace(/[^0-9]/gi, "").substring(0, 8); // 去掉非数字&&保留8位
      if (arr[0] == "") {
        arr[0] = 0;
      }
      arr[0] = parseInt(arr[0]);
      if (arr.length > 1) {
        num = ".";
        num += arr[1].replace(/[^0-9]/gi, "").substring(0, 2);
      }
      this.value = arr[0] + num;
      this.$emit("update:val", this.value);
    },
    deep: true
  },
  mounted() {
    this.getAccountInfo(); //账号信息
  },
  methods: {
      routerPush(name,showTab,type) {
        util.routerTo(name,{
              showTab: showTab,
              type:type
          })
      },
    getdatetime(now, l = "-", m = ":") {
      now = new Date(now);
      let year = now.getFullYear();
      let month = now.getMonth() + 1;
      let date = now.getDate();
      let hour = now.getHours();
      let minute = now.getMinutes();
      let seconds = now.getSeconds();
      if (month < 10) {
        month = "0" + month;
      }
      if (date < 10) {
        date = "0" + date;
      }
      if (hour < 10) {
        hour = "0" + hour;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (seconds < 10) {
        seconds = "0" + seconds;
      }
      return (
        year + l + month + l + date + " " + hour + m + minute + m + seconds
      );
    },
    getAccountInfo() {
      let data = {
        orgId: this.merchantId
      };
      getAccountInfo(data).then(res => {
        this.message = res.data;
        this.message.timeOut = this.getdatetime(this.message.timeOut);
      });
    },
    activateBankCard() {
      let data = {
        orgId: this.merchantId,
        actiinfo: this.value,
        type: 0,
        bankCardNumber: this.message.bankCardNumber,
        bizSerialNumber: ""
      };
      activateBankCard(data).then(res => {
        if (res.data.message == "成功") {
          this.$store.commit("SETISRELOADDATA", true);
          util.routerTo("/financial-center/account-center/finance-account")
          this.$message({
            message: "验证成功",
            type: "success"
          });
        } else {
          this.$message({
            message: res.data.message,
            duration: "3000"
          });
        }
      });
    },
    submitForm(formName) {
      if (this.value == undefined) {
        this.$message({
          message: "请输入打款金额",
          duration: "3000"
        });
      } else {
        this.activateBankCard();
      }
    },
    blur(val) {
      if (val.substr(val.length - 1, 1) == ".") {
        this.value = this.value.substr(0, this.value.length - 1);
      }
    },
    goBack() {
      history.back();
    }
  }
};
</script>
<style scoped>
.content {
  width: 800px;
  margin: 20px 0 0 30px;
}
.content .box1 {
  color: #606266;
  font-size: 16px;
  margin: 50px 0 30px 30px;
}
.content .span2 {
  position: absolute;
  left: 270px;
  top: 0px;
  color: #c0c4cc;
  width: 252px;
}
.commonInput {
  height: 27px;
  width: 210px;
}
</style>

